<template>
	<view class="body">
		<myHeader :title="title"></myHeader>
		<view class="header">
			<view>
				  <uni-segmented-control :current="current" :values="items"  @clickItem="onClickItem" styleType="button" activeColor="#4cd964"></uni-segmented-control>
				
					
					<uni-search-bar @confirm="input()"
					  v-model="search"
					   @clear="search"
					   @cancel="cancel">
					</uni-search-bar>
				</view>
		</view>
		<view class="main">
			 <view>
			        <view class="content">
			            <view v-show="current === 0">
			                
			                <!-- 滑块内容 -->
			                <scroll-view scroll-y="true" class="scroll-Y" style="height: 400px;">
			                	<image v-if="doloadData.length===0" 
			                	 src="../../static/party_building/assets/nothing.png" mode="">
			                	</image>
			                	<uni-collapse>
			                	    <uni-collapse-item   v-for="(item,key) in doloadData" :title="item.title" >
			                	        <view style="padding: 30rpx;">
			                	          <uni-card :title="item.title" :note="item.address" :is-shadow="true"
			                	          	:extra="item.extra">
			                	          	<!-- <template v-slot:footer> -->
			                	          	<template solt="footer">
			                	          		<view class="footer-box">
			                	          			<uni-steps activeColor="#e20909" :options="item.pop" direction="column"
			                	          				:active="item.active"></uni-steps>
														<button type="default" class="mybutton" @click="gotoDetail(item)" size="mini">预览详情</button>
														<button type="default" class="mybutton"  @click="dojob(item)" size="mini">开始任务</button>
			                	          		</view>
			                	          	</template>
			                	          </uni-card>
			                	        </view>
			                	    </uni-collapse-item>
			                	</uni-collapse>
			                	
			                	<!-- 加载更多 -->
			                	<uni-load-more
			                		 @clickLoadMore="doclickLoadMore" 
			                		:status="doloadMore" :showIcon="false"
			                		iconType="auto" 
			                		:contentText="{
			                		contentdown: '点击显示更多',
			                		contentrefresh: '正在加载...',
			                		contentnomore: '没有更多数据了'}">
			                	</uni-load-more>
			                
			                </scroll-view>
			            </view>
			            <view v-show="current === 1">
			                
			                <!-- 滑块内容 -->
			                <scroll-view scroll-y="true" class="scroll-Y" style="height: 400px;">
			                	<image v-if="doneloadData.length===0" 
			                	 src="../../static/party_building/assets/nothing.png" mode="">
			                	</image>
			                	<uni-collapse>
			                	    <uni-collapse-item   v-for="(item,key) in doneloadData" :title="item.title" >
			                	        <view style="padding: 30rpx;">
			                	          <uni-card :title="item.title" :note="item.address" :is-shadow="true"
			                	          	:extra="item.extra">
			                	          	<!-- <template v-slot:footer> -->
			                	          	<template solt="footer">
			                	          		<view class="footer-box">
			                	          			<uni-steps activeColor="#e20909" :options="item.pop" direction="column"
			                	          				:active="item.active"></uni-steps>
														<button type="default" class="mybutton"  @click="gotoDetail(item)" size="mini">查看详情</button>
			                	          		</view>
			                	          	</template>
			                	          </uni-card>
			                	        </view>
			                	    </uni-collapse-item>
			                	</uni-collapse>
			                	
			                	<!-- 加载更多 -->
			                	<uni-load-more
			                		 @clickLoadMore="doneclickLoadMore" 
			                		:status="doneloadMore" :showIcon="false"
			                		iconType="auto" 
			                		:contentText="{
			                		contentdown: '点击显示更多',
			                		contentrefresh: '正在加载...',
			                		contentnomore: '没有更多数据了'}">
			                	</uni-load-more>
			                
			                </scroll-view>
			            </view>
			        </view>
			    </view>
		</view>
	</view>
</template>

<script>
	import {
		getVMeetListByGroup,
		getVolunteerMeetDetail,
		getVMeetListByCrew
	} from '../../api/api_voluntee.js'
	import myHeader from '../components/head.vue'
	import {
		getMeetingByCrew,
		getMeetingByMonitor,
		monitorMeetingTask,
	}
	from '../../api/api_party_task.js'
	export default{
		data(){
			return{
				filenumber :5,//最多上传五个文件
				title:"志愿者服务队",
				search:'',
				current :0,
				items:["待处理","已处理"],
				doloadMore:'more',
				doneloadMore:'more',
				doParam://处理
					{
						"current": 1,
						"pageSize": 10,
						"total":0,
						"param": {
							"handleStatus": 0,
							"meetName": "",
						}
					},//0：监督小组 1：质量小组 2：安全小组]
				doneParam://已处理
					{
						"current": 1,
						"pageSize": 10,
						"total":0,
						"param": {
							"handleStatus": 1,
							"meetName": "",
						}
					},
				doloadData: [ 
				],
				doneloadData: [ 
				],
				pattern: {//按钮样式
					color: "#FFF",
					selectedColor: "#007AFF",
					backgroundColor: "#2096f3",
					buttonColor: "#e20909"
				},
				
			}
		},components:{
			myHeader
		},onShow(){
			this.restoreData()
		},created() {
			
		} ,creonPullDownRefresh() {
			this.restoreData()
			setTimeout(function () {
				uni.stopPullDownRefresh();
			}, 1000);
		},methods:{
			onClickItem(ars) {
				this.current = ars.currentIndex
			},
			gotToTask(item){
				uni.navigateTo({
					'url':'./meettingdetails/taskReadOnly?meetingTaskId='+item.redata.meetingTaskId
				})
			},
			restoreData(){
				this.doloadMore='more',
				this.doneloadMore='more',
				this.doParam={
						"current": 1,
						"pageSize": 10,
						"total":0,
						"param": {
							"handleStatus": 0,
							"meetName": "",
						}
					},//0：监督小组 1：质量小组 2：安全小组]
				this.doneParam={
						"current": 1,
						"pageSize": 10,
						"total":0,
						"param": {
							"handleStatus": 1,
							"meetName": "",
						}
					},
				this.doloadData= [ 
				],
				this.doneloadData= [ 
				],
				this.doclickLoadMore();
				this.doneclickLoadMore();	
			},
			doclickLoadMore(){//待处理会议
				this.doloadMore = 'loading'
				let _this = this;
					getVMeetListByCrew(
					_this.doParam
					).then(res =>{
						_this.doloadMore = 'more'
						if(res.total<_this.doParam.pageSize){
							 _this.doloadMore = 'noMore'
						}
					//处理过程
					let data = []
					res.records.forEach(item =>{
						let extra = ""
						switch(item.meetStatus){
							case 1:
								extra = "方案指派"
								break;
							case 2:
								extra = "上传方案"
								break;
							case 3:
								extra = "审批通过"
								break;
							case 4:
								extra = "驳回方案"
								break;
							default:
								extra = "状态未知"
						}
						let admin = item.judgeUser===null?'志愿者服务队组长':item.judgeUser+' '+item.judgeTime
						data.push({//data是最终展示数据
							address:"创建时间："+item.createTime,
							extra,
							title: item.meetName,
							createUser:item.createUser,
							pop: [{
									title: '指派任务',
									desc:item.createUser+' ' +item.createTime
								},
								{
									title: '提交方案',
									desc: '执行人：'+item.planUser
								},
								{
									title: '审批结束',
									desc: admin
								},
								
							],
							active:Number.parseInt(item.meetStatus-1),//步骤
							redata:item,
						})
					})
					_this.doParam.current++;
					_this.doloadData = _this.doloadData.concat(data)
					// _this.param.pageSize = res.size
					// _this.param.total = res.total
					})
			},
			dojob(ars){
				uni.navigateTo({
					url:'./dojob?meetingId='+ars.redata.meetId
				})
			},
			gotoDetail(ars){
				uni.navigateTo({
					url:'./templateDetails?meetingId='+ars.redata.meetId
				})
			},
			doneclickLoadMore(){//已经处理会议
				this.doneloadMore = 'loading'
				let _this = this;
					getVMeetListByCrew(
					_this.doneParam
					).then(res =>{
						_this.doneloadMore = 'more'
						if(res.total<_this.doneParam.pageSize){
							 _this.doneloadMore = 'noMore'
						}
					//处理过程
					let data = []
					res.records.forEach(item =>{
						let extra = ""
						switch(item.meetStatus){
							case 1:
								extra = "方案指派"
								break;
							case 2:
								extra = "上传方案"
								break;
							case 3:
								extra = "审批通过"
								break;
							case 4:
								extra = "驳回方案"
								break;
							default:
								extra = "状态未知"
						}
						let admin = item.judgeUser===null?'志愿者服务队组长':item.judgeUser+' '+item.judgeTime
						data.push({//data是最终展示数据
							address:"创建时间："+item.createTime,
							extra,
							title: item.meetName,
							createUser:item.createUser,
							pop: [{
									title: '指派任务',
									desc:item.createUser+' ' +item.createTime
								},
								{
									title: '提交方案',
									desc: '执行人：'+item.planUser
								},
								{
									title: '审批结束',
									desc: admin
								},
								
							],
							active:Number.parseInt(item.meetStatus-1),//步骤
							redata:item,
						})
					})
					_this.doneParam.current++;
					_this.doneloadData = _this.doneloadData.concat(data)
					// _this.param.pageSize = res.size
					// _this.param.total = res.total
					})
			},
			cancel(){//搜索框取消
				this.restoreData()
			},
			input(){//值改变
					this.param.current = 1,
					this.pageSize = 10,
					this.loadData= [];
				this.clickLoadMore()
			}
		}
	}
</script>

<style lang="scss" scoped>
	
	/**
	 * 定义按钮样式
	 */
	@mixin button-commit {
		background: linear-gradient(180deg, #ff5e59, #e20909);
		color: #fff;
	}
	.body{
		background-color: #f7f7f7;
		height: 100%;
		.mybutton{
				@include button-commit;
				margin-top: 5%;
		}
	}
	.header{
		background-color: #fff;
		height: 200upx;
		margin-top: 5%;
		/deep/ .uni-searchbar{
			width:95%;
			margin: 0 auto 0 auto;
		}
		/deep/ .segmented-control {
			width: 90%;
			margin: 0 auto;
			border:none !important;
				.segmented-control__item{
					border-color:#e20909 !important;
					font-size: 14px !important;
					background-color: #fff !important;
					span{
						color: #e20909 !important;
					}
				}
			.segmented-control__item--button--active {
				background: #2096f3 linear-gradient(180deg,#ff5e59,#e20909);
				border: none !important;
				span{
					color: #fff !important;
				}
			}
			.segmented-control__item--button--first{
				width: 90%;
				
			}
		}
	}
	.main{
		background-color: #fff;
		width: 95%;
		margin: 5% auto 0 auto;
		height: 65%;
		.content{
			/deep/ .uni-transition{
							.uni-popup__wrapper-box{
							background-color: #FFFFFF;
							padding: 50upx;
							}
					
			}
			/deep/ .uni-card{
				margin: 0;
			}
		}
	}
	
</style>
